﻿@{
    Layout = null;
    //获取申请人参照列,请假

}
<title>
    <fap-multilang lang-key="my_attendance" default-content="我的考勤"></fap-multilang>
</title>

<link href="~/Content/css/fullcalendar.css" rel="stylesheet" />
<link href="~/Content/css/fullcalendar.print.css" rel="stylesheet" media='print' />
<style>
    .billskin .layui-layer-btn0 {
        background-color: #d15b47 !important;
        border-color: #428bca;
    }
</style>
<div class="row">
    <div class="col-xs-12">
        <div id="dialog-bizprocess" class=""><div class="row"><div id="DialogFrame_BizProcess" class="col-xs-12"></div></div></div>

        <div class="row">
            <div class="col-sm-9">
                <div class="space"></div>
                @*<div id='loading'>loading...</div>*@
                <!-- #section:plugins/data-time.calendar -->
                <div id="calendar"></div>

                <!-- /section:plugins/data-time.calendar -->
            </div>

            <div class="col-sm-3">
                <div class="row">
                    <div class="col-sm-12">
                        <div class="space-32"></div>
                        <div class="infobox infobox-red">
                            <div class="infobox-icon">
                                <i class="ace-icon fa fa-ban"></i>
                            </div>
                            <div class="infobox-data">
                                <span class="infobox-data-number absense">0</span>
                                <div class="infobox-content">缺勤</div>
                            </div>
                        </div>
                        <div class="infobox infobox-pink">
                            <div class="infobox-icon">
                                <i class="ace-icon fa fa-clock-o"></i>
                            </div>
                            <div class="infobox-data">
                                <span class="infobox-data-number cz">0</span>
                                <div class="infobox-content">迟、退次数</div>
                            </div>
                        </div>
                        <div class="infobox infobox-blue">
                            <div class="infobox-icon">
                                <i class="ace-icon fa fa-leaf"></i>
                            </div>
                            <div class="infobox-data">
                                <span class="infobox-data-number takeleave">0</span>
                                <div class="infobox-content">请假时长</div>
                            </div>
                        </div>
                        <div class="infobox infobox-blue2">
                            <div class="infobox-icon">
                                <i class="ace-icon fa fa-plane"></i>
                            </div>
                            <div class="infobox-data">
                                <span class="infobox-data-number travel">0</span>
                                <div class="infobox-content">出差时长</div>
                            </div>
                        </div>
                        <div class="infobox infobox-green">
                            <div class="infobox-icon">
                                <i class="ace-icon fa fa-star-half-o"></i>
                            </div>
                            <div class="infobox-data">
                                <span class="infobox-data-number annual">@ViewBag.Annual</span>
                                <div class="infobox-content">剩余年假天数</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script> 
    var scripts = [null, "/Content/js/fullcalendar.js", "/Content/js/language/lang-all.js","/Scripts/Workflow/business.js", null]
    $('.page-content-area').ace_ajax('loadScripts', scripts, function () {
        jQuery(function ($) {
            var startDate,endDate;
            var date = new Date();
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();
            var calendar = $('#calendar').fullCalendar({
                lang: "zh-cn",
                buttonHtml: {
                    prev: '<i class="ace-icon fa fa-chevron-left"></i>',
                    next: '<i class="ace-icon fa fa-chevron-right"></i>'
                },
                header: {
                    left: 'title',
                    center: '',
                    right: 'prev,next today'
                },
                //defaultDate: '2016-01-12',
                selectable: true,
                selectHelper: true,
                select: function (start, end) {
                    startDate=moment(start).format('YYYY-MM-DD');
                    endDate = moment(end).format('YYYY-MM-DD');
                    $.ajax({
                        url: '@Url.Content("~/Time/Api/MyCardRecord")',
                        type: 'post',
                        dataType: 'json',
                        //async: false,//使用同步的方式,true为异步方式
                        data: { start:startDate , end: endDate },//这里使用json对象
                        success: function (data) {
                            var msg = $.lang("no_card_data", "未找到打卡数据") + "！";
                            if (data.length > 0) {
                                msg = "";
                                for (var i = 0; i < data.length; i++) {
                                    if (msg != "") msg += "<br/>";
                                    msg += $.lang("card_time", "打卡时间") + ":" + data[i].cardTime;
                                }

                            }
                            bootbox.dialog({
                                message: msg,
                                footer: false,
                                title: moment(start).format("MM月DD日打卡信息"),
                                buttons: {
                                    Takeleave: {
                                        label: "请假",
                                        className: "btn-link btn-primary",
                                        callback: function () {
                                            let initData = { StartTime: startDate + " 09:00", EndTime: endDate +" 19:00"}
                                            applyBusiness('3517874395701837824', "请假申请",initData);
                                            return false;
                                        }
                                    },
                                    Travel: {
                                        label: "出差",
                                        className: "btn-link btn-primary",
                                        callback: function () {
                                            let initData = { StartTime: startDate + " 09:00", EndTime: endDate + " 19:00" }
                                            applyBusiness('3535685594350878720', "出差申请", initData);
                                            return false;
                                        }
                                    },
                                    Makeup: {
                                        label: "补签",
                                        className: "btn-link btn-primary",
                                        callback: function () {
                                            let initData = { CardStartDate: startDate, CardEndDate: endDate }
                                            applyBusiness('3535685657470959616', "补签申请",initData);
                                            return false;
                                        }
                                    },
                                }
                            });

                        },
                        fail: function () {
                            //code here...
                        }
                    });

                },
                editable: true,
                eventLimit: true, // allow "more" link when too many events
                events: function (start, end, callback) {
                    var index=layer.load();
                    $.ajax({
                        url: '@Url.Content("~/Time/Api/MyDayResult")',
                        type: "post",
                        dataType: "json",
                        data: { start: moment(start).format("YYYY-MM-DD"), end: moment(end).format("YYYY-MM-DD"), month: moment($('#calendar').fullCalendar('getDate')).format("YYYY-MM") },
                        success: function (data) {
                            layer.close(index);
                            $(".infobox-data-number.absense").html(data.kg);
                            $(".infobox-data-number.takeleave").html(data.qj);
                            $(".infobox-data-number.cz").html((data.cd + data.zt));
                            $(".infobox-data-number.travel").html(data.cc);
                           

                            for (var i = 0; i < data.list.length; i++) {
                                //$("#calendar").fullCalendar("removeEvents", data.list[i].id);
                                var className = 'label-success';

                                if (data.list[i].calResult.indexOf("迟到") > -1 || data.list[i].calResult.indexOf("早退") > -1) {
                                    className = 'label-warning'

                                }
                                if (data.list[i].calResult.indexOf("出差") > -1 || data.list[i].calResult.indexOf("公差") > -1 || data.list[i].calResult.indexOf("同城") > -1 || data.list[i].calResult.indexOf("外") > -1) {
                                    className = 'label-info'
                                }
                                if (data.list[i].calResult.indexOf("假") > -1) {
                                    className = 'label-yellow'
                                }
                                if (data.list[i].calResult.indexOf("缺勤") > -1) {

                                    className = 'label-important'
                                }

                                calendar.fullCalendar('renderEvent',
                                {
                                    id: data.list[i].id,
                                    title: data.list[i].calResult,
                                    start: new Date(data.list[i].currDate),
                                    end: new Date(new Date(data.list[i].currDate).getTime() + 24 * 60 * 60 * 1000),
                                    className: className,
                                    allDay: "allDay",
                                },
                                false // make the event "stick"
                            );
                            }
                        },
                        error: function (e) {
                            alert("异常！");
                        }
                    });
                },
                eventClick: function (calEvent, jsEvent, view) {

                    //弹出打卡记录

                }
            });
        })
    })
</script>
